<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        function GetSelection () {
            var selection = "";

            var textarea = document.getElementById("myArea");
            if ('selectionStart' in textarea) {
                    
                if (textarea.selectionStart != textarea.selectionEnd) {
                    selection = textarea.value.substring  (textarea.selectionStart, textarea.selectionEnd);
                }
            }
            else {  // Internet Explorer before version 9
                    // create a range from the current selection
                var textRange = document.selection.createRange ();//마우스로 드래그하여 생긴 영역에 대해 textRange객체를 만든다
                    // check whether the selection is within the textarea
                var rangeParent = textRange.parentElement ();
                if (rangeParent === textarea) {
                    selection = textRange.text;

                }
            }

            if (selection == "") {
                alert ("No text is selected.");
            }
            else {
                alert ("The current selection is: " + selection);
            }
        }
        
        function makeBold() {
        	
        	var selection = "";

            var textarea = document.getElementById("myArea");
            if ('selectionStart' in textarea) {
                    
                if (textarea.selectionStart != textarea.selectionEnd) {
                    selection = textarea.value.substring(textarea.selectionStart, textarea.selectionEnd);
                }
            }
            else {  // Internet Explorer before version 9
                    // create a range from the current selection
                var textRange = document.selection.createRange ();//마우스로 드래그하여 생긴 영역에 대해 textRange객체를 만든다
                    // check whether the selection is within the textarea
                var rangeParent = textRange.parentElement ();
                if (rangeParent === textarea) {
                    selection = textRange.text;
					console.log("selection : " + selection);
					var selectSpan = document.createElement('span');
					selectSpan.innerHTML = selection;
					selectSpan.style.fontWeight = 'bold';
					document.getElementById("myArea").appendChild(span);
                }
            }
			
        }
    </script>
</head>
<body>
    <textarea id="myArea" spellcheck="false">Select some text within this field.</textarea>
    <button onclick="GetSelection ()">Get the current selection</button>
    <button onclick="makeBold ()">Bold</button>
</body>
</html>